<template>
  <!--图片资源选择器-->
  <componentBox :id="id" :ref="id" :option="config.location">
    <img :src="path" alt="" style="width: 100%;height: 100%;overflow: hidden">
  </componentBox>
</template>

<script>
    import * as u from '@/util/util'
    export default {
        name: "index",
        components: {
            'componentBox': () => import('@/components/screen/componentBox.vue'),
        },
        props: {
            id: String,
            config: Object,
        },
        data() {
            return {
                path: "",
                option: {},
            }
        },
        computed: {
            //判断是否可以操作dom
            screenMove() {
                return this.$store.state.screenMove
            },
        },
        watch: {
            "config.option": {
                handler(newVal) {
                    //设置值
                    this.initUrl();
                },
                deep: true,
            },

        },
        created() {
            this.option = this.config.option;
            this.initUrl();
        },
        methods: {
            //初始化url
            initUrl() {
                if (this.option.source == 'local') {
                    this.path = u.getFileAllUrl(this.option.url);
                } else if (this.option.source == 'internet') {
                    this.path = this.option.url;
                }
                console.log(this.path);
            }

        }
    }
</script>

<style scoped>

</style>
